<template>
  <div>
    <ul class="list-group">
      <li 
      class="list-group-item"
      v-for="item in list"
      :key="item.id"
      >
        <input @click="changeState(item.id)" type="checkbox" :checked="item.done">
        <span>{{item.title}}</span>
      </li>
    </ul>
  </div>
</template>
<script>
import {mapMutations} from 'vuex'
export default {
  data() {
    return {};
  },
  props:{
    list:{
      type:Array,
      default:function(){
        return[]
      }
    }
  },
  methods:{
    ...mapMutations(['chageState']),
    changeState(id){
      this.chageState(id);
    }
  }
};
</script>

<style lang='less' scoped>
</style>